<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ include file="../include/taglibs.jsp"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title>用户表单页面</title>
<%@ include file="../include/easyui.jsp"%>
</head>
<body>
<div>
	<form id="mainform" action="${ctx }/system/user/${action}" method="post">
		<table class="formTable">
			<tr>
				<td>用户名：</td>
				<td>
					<c:if test="${action == 'update'}">
						<input type="hidden" name="id" value="${id }"/>
					</c:if>
					<input id="username" name="username" class="easyui-validatebox" data-options="width: 150" value="${user.username }">
				</td>
			</tr>
			<c:if test="${action == 'add'}">
				<tr>
					<td>密码：</td>
					<td><input id="password" name="password" type="password" class="easyui-validatebox" data-options="width: 150,required:'required',validType:'length[6,20]'"/></td>
				</tr>
				<tr>
					<td>确认密码：</td>
					<td><input id="confirmPassword" name="confirmPassword" type="password" class="easyui-validatebox" data-options="width: 150,required:'required',validType:'equals[$(\'#password\').val()]'"/></td>
				</tr>
			</c:if>
			<tr>
				<td>性别：</td>
				<td>
					<input type="radio" id="man" name="gender" value="0"/><label for="man">男</label>
					<input type="radio" id="woman" name="gender" value="1"/><label for="woman">女</label>
				</td>
			</tr>
			<tr>
				<td>出生日期：</td>
				<td><input type="text" name="birthday" class="easyui-my97" datefmt="yyyy-MM-dd" data-options="width: 150" value="<fmt:formatDate value='${user.birthday}'/>"/></td>
			</tr>
			<tr>
				<td>电子邮箱：</td>
				<td><input type="text" name="email" value="${user.email }" class="easyui-validatebox" data-options="width: 150,validType:'email'"/></td>
			</tr>
			<tr>
				<td>电话：</td>
				<td><input type="text" name="phone" value="${user.phone }" class="easyui-numberbox"  data-options="width: 150"/></td>
			</tr>
			<tr>
				<td>类型：</td>
				<td>
                    <select id="userType" name="userType"  class="easyui-combobox" data-options="width:140,height:29,editable:false,panelHeight:'auto'">
                        <option value="0" <c:if test="${user.userType == '0'}">selected</c:if>>内部用户</option>
                        <option value="1" <c:if test="${user.userType == '1'}">selected</c:if>>外部用户</option>
                    </select>
				</td>
			</tr>
			<tr>
				<td>是否有效：</td>
				<td>
                    <select id="status" name="status"  class="easyui-combobox" data-options="width:140,height:29,editable:false,panelHeight:'auto'">
                        <option value="0" <c:if test="${user.status == '0'}">selected</c:if>>有效</option>
                        <option value="1" <c:if test="${user.status == '1'}">selected</c:if>>无效</option>
                    </select>
				</td>
			</tr>
			<tr>
				<td>所属机构：</td>
				<td><input type="text" id="oId" name="orgId" value="${user.orgId}" class="easyui-numberbox"  data-options="width: 150"/></td>
			</tr>
		</table>
	</form>
</div>

<script type="text/javascript">
var action="${action}";
//父级权限
$('#oId').val(orgId);

//机构树
$('#oId').combotree({
	width:180,
	method:'GET',
	url: '${ctx}/system/organization/list',
	idField : 'id',
	textFiled : 'name',
	parentField : 'parentId',
	iconCls: 'icon',
	animate:true
});

//添加修改区分
if(action=='add'){
	$("input[name='gender'][value='1']").attr("checked",true);
	//用户名存在验证
	$('#username').validatebox({
	    required: true,    
	    validType:{
	    	length:[2,20],
	    	remote:["${ctx}/system/user/checkUsername","username"]
	    }
	});  
}else if(action=='update'){
	$("input[id='username']").attr('readonly','readonly');
	$("input[id='username']").css('background','#eee')
	$("input[name='gender'][value=${user.gender}]").attr("checked",true);
}

//提交表单
//form提交自动调用validaebox组件验证提交
//ajax可以指定dateType:'json'，但form提交需要对返回的数据进行JSON转换，调用$.parseJSON(str)
$('#mainform').form({
    onSubmit: function(){
    	var isValid = $(this).form('validate');
		return isValid;	// 返回false终止表单提交
    },    
    success:function(data){
        //在使用Easyui的表单提交的时候，经常需要返回Json 数据，可是有时返回的是Json字符串，不是Json对象，字符串中的数据无法读取。
        //解决这一问题，需要用到Jquery中的Json对象转换方法：$.parseJSON(str)或者使用eval函数
        var data = eval('(' + data + ')');
        successTip(data.message,dg,dialog);
    }    
});    
</script>
</body>
</html>